<template>
  <div class="home">
    <section class="homeTop">
      <el-card class="homeCard">
        <template #header>
          <div class="homeTopLeft">
            <div>
              <div class="homeTopLeft1">
                {{ HandleTipsTitle() }}!
                <!-- {{ userInfo.name }} -->
              </div>
              <div class="homeTopLeft2">
                {{ HandleTips() }}
              </div>
            </div>
            <div></div>
          </div>
        </template>
        <div class="homeTopLeft3">
          <div class="homeTopLeft3_1">
            <div class="homeTopLeft3Time">
              {{
                timeSecond.year + '/' + timeSecond.month + '/' + timeSecond.day
              }}
              {{
                timeSecond.hour +
                ':' +
                timeSecond.minute +
                ':' +
                timeSecond.second
              }}
            </div>
            <div class="homeTopLeft3Time1">
              {{ timeSecond.weekday }}
            </div>
          </div>
        </div>
      </el-card>
      <!-- 基础信息 -->
      <div class="baseInfo">
        <el-card class="useMode">
          <template #header>
            <div class="homeTopRight">
              <div class="homeCardTitleLeft">常用功能</div>
            </div>
          </template>
          <section>
            <div
              v-for="(item, index) in useList"
              :key="index"
              class="useRouter"
              @click="router.push(item.route)"
            >
              <el-avatar
                class="homeImage1"
                shape="square"
                :src="`${ossURlZjk}/dms/image/${item.icon}`"
              />
              <div class="homeTopRightText">
                {{ item.title }}
              </div>
            </div>

            <div class="empty" v-if="!useList.length">
              <el-empty :image-size="50" description="暂无数据" />
            </div>
          </section>
        </el-card>
        <div class="noticeMode">
          <SystemNotice class="notice" ref="systemNoticeRef" />
        </div>
      </div>
    </section>
    <!-- 业务统计 -->
    <section>
      <el-card class="homeCard1">
        <template #header>
          <div class="homeTopRight">
            <div class="homeCardTitleLeft">业务统计</div>
          </div>
        </template>
        <div class="homeTopRight1 newRight" v-loading="groupTotalLoading">
          <div
            v-for="(item, index) in _businessList"
            :key="index"
            class="homeMiddle"
          >
            <el-avatar
              class="homeImage2"
              shape="square"
              :src="`${ossURlZjk}/dms/image/${item?.icon}`"
            />
            <div style="margin-left: 16px">
              <div class="homeMiddle1">
                {{ item.title }}
              </div>
              <div class="homeMiddle2">
                {{ item.value ? NumberFormat(item.value, 0) : 0 }}
              </div>
            </div>
          </div>
        </div>
      </el-card>
    </section>

    <section>
      <aside class="left">
        <CustomAnalysis class="analysis" ref="customAnalysisRef" />
      </aside>
      <aside class="right">
        <RankingList ref="rankingListref" />
      </aside>
    </section>
  </div>
</template>

<script lang="ts" setup>
  import _ from 'lodash'
  import SystemNotice from './vabAutoComponents/SystemNotice.vue'
  import CustomAnalysis from './vabAutoComponents/CustomAnalysis.vue'
  import RankingList from './vabAutoComponents/RankingList.vue'
  import {
    BusinessList,
    CommonUseList,
    HandleTips,
    HandleTipsTitle,
    AnySecondTime,
  } from './vabAutoComponents/tools'
  import { ossURlZjk } from '~/src/config'
  import { getOrderGroupTotal } from '~/src/api/dms/home/homeCustomer'
  import {
    ArrayStrFlat,
    ArrayOneValue,
    BaseUserInfo,
    CheckRouterAuth,
    NumberFormat,
  } from '~/src/utils/utils'

  defineOptions({
    name: 'Index',
  })

  const router = useRouter()
  const groupTotalLoading = ref(false)
  const useList = ref<any>(CommonUseList)
  const _businessList = ref<any>(BusinessList)

  const timeSecond = ref<any>({
    year: '--',
    month: '--',
    day: '--',
    hour: '--',
    minute: '--',
    second: '--',
    weekday: '--',
  })

  // 业务统计
  const _getOrderGroupTotal = async () => {
    groupTotalLoading.value = true
    try {
      let res = await getOrderGroupTotal()

      _businessList.value.forEach((item: any) => {
        for (const key in res.data) {
          if (item.key == key) {
            item.value = res.data[key]
          }
        }
      })

      groupTotalLoading.value = false
    } catch (error) {}
  }

  const _getCommonUseList = async () => {
    // 主应用 全部权限
    const { is_master, menu } = BaseUserInfo()
    if (is_master) return

    const cloneArray = _.cloneDeep(useList.value)

    /*
      如果父级未被选中 子集不显示
    */
    // 本地路由
    const locaRoutes: any = await CheckRouterAuth(menu)
    // 获取父集路由

    let menuInit: any = [] //权限展示路由 【初始】
    let menuMiddle: any = [] //权限展示路由【降维】
    let menuEnd: any = [] // 权限展示路由 与 个人权限菜单 求交集 【最终】

    for (let i = 0; i < locaRoutes.length; i++) {
      const item = locaRoutes[i]
      if (item?.meta?.authShow) {
        const childrenRouter = ArrayOneValue(item.children, 'name')
        await menuInit.push(childrenRouter)
      }
    }

    menuMiddle = ArrayStrFlat(menuInit)

    menuEnd = await menu.filter((row: any) => {
      for (const item of menuMiddle)
        if (row == `${item}.all` || row == `${item}.readonly`) return item
    })

    for (let i = 0; i < cloneArray.length; i++) {
      const row = cloneArray[i]

      if (
        menuEnd.indexOf(row.name + '.all') > -1 ||
        menuEnd.indexOf(row.name + '.readonly') > -1
      ) {
        row.authShow = true
      } else {
        row.authShow = false
      }
    }

    useList.value = await cloneArray.filter((item: any) => item.authShow)
  }

  onUnmounted(() => {
    // 卸载
    clearInterval(timeSecond.value)
    timeSecond.value = null
  })
  onMounted(() => {
    setInterval(() => {
      timeSecond.value = AnySecondTime()
    }, 1000)

    _getOrderGroupTotal()
    _getCommonUseList()
  })
</script>

<style lang="scss" scoped>
  @import './index';
</style>
